<template>
	<div class="">
		<!-- 顶部背景图 -->
		<div class="headImg" style="
        width: 100%;
        height: 330px;
        background-image: url(https://nec.xmu.edu.cn/images/banner-inner2.jpg);
      ">
			<!-- display:flex;justify-content: center;border:1px solid #000; -->
			<div class="" style="">
				<h1 style="color: #fff; font-weight: 600; font-size: 50px;">通知公告</h1>
			</div>
			<div class="breadcrumb">
				<span style="color: #fff">所在位置：</span>
				<el-breadcrumb separator-class="el-icon-arrow-right">
					<el-breadcrumb-item :to="{ path: '/informs' }"><span style="color: #fff">首页</span>
					</el-breadcrumb-item>
					<el-breadcrumb-item><span style="color: #fff">通知公告</span></el-breadcrumb-item>
					<el-breadcrumb-item><span style="color: #fff">正文</span></el-breadcrumb-item>
				</el-breadcrumb>
			</div>
		</div>

		<!-- 通知内容 -->
		<div class="Centent">
			<div class="Centent-head">
				<span
					style="font-size: 18px; font-weight: 600;display:flex;justify-content: center;">{{informMsg.title}}</span>
				<div style="
            width: 100%;
            height: 2px;
            background-color: #d5d5d5;
            margin: 20px 0;
          " />
				<div class="" style="
            font-size: 14px;
            color: #a3a3a3;
            display: flex;
            justify-content: center;
            align-items: center;
          ">
					
					<div class="" style="margin: 0 10px">
						<span>发布日期：</span>
						<span>{{informMsg.create_time}}</span>
					</div>
				</div>
				<div class="informsMSG" style="margin-bottom: 100px;padding: 40px;" v-html="richTextFormat(informMsg.content)"></div>
				<!-- <div class="" style="display: flex; justify-content: flex-start;margin: 40px 0; ">
					<span style="font-size: 14px; font-weight: 600">附件【<span
							style="color: #428bca; cursor: pointer">附件1：厦门大学继续教育学院派遣制工作人员应聘申请表.doc</span>】已下载496次</span>
				</div> -->
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				informMsg: "",
			};
		},
		methods: {
			//富文本过滤
			richTextFormat(value = '', len = 30000) {
				// value = value.replace(/<\[^>]*>/g,'')
				value = value.replace(/<\.+?>/g, '');
				value = value.replace(/\s+/g, '');
				if (value.length > 30) {
					return value.slice(0, len) + "...";
				}
				return value;
			},
		},
		created() {
			this.informMsg = JSON.parse(sessionStorage.getItem('TongZhiItems'))
			// this.informMsg = JSON.parse(sessionStorage.getItem('TongZhiItem'))
			// console.log(Infor);
		}
	};
</script>

<style lang="scss" scoped>
	.headImg {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-around;
		padding-left: 200px;

		.breadcrumb {
			display: flex;
			align-items: center;

			.myColor>>>.el-breadcrumb__inner {
				color: #3a6df3;
			}
		}
	}

	.Centent {
		width: 100%;
		display: flex;
		justify-content: center;

		.Centent-head {
			width: 1200px;

			.informsMSG {
				min-height: 200px;
				width: 1200px;
				box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
				margin: 40px 0;
			}
		}

		margin-top: 40px;
	}
</style>
